import PackageAndGiveawayTabs from "@/pages/OrderModule/common/bizcomponents/PackageAndGiveawayTabs";
import { CommonForm } from "@/pages/OrderModule/common/components/CommonForm";
import { CommonModal } from "@/pages/OrderModule/common/components/CommonModal";
import SubTitle from "@/pages/OrderModule/common/components/SubTitle";
import { Form, Radio, Select, Space } from "antd";
import OrderAreaRadioGroup from "../../components/OrderAreaRadioGroup1";
import OrderNumberCount from "../../components/OrderNumberCount";
import CommonLoading from "@/components/CommonLoading";
import { useState, useRef, useEffect, useMemo } from "react";
import { setBatchPackageGiftOp } from "../../../../services";
import { message } from "antd";

/** 设置包装和赠品 */
function SetPackageAndGiveawayModal(props) {
	const { searchForm, orderList, selectKeys, handleCancel, handleOk } = props;

	const [showNumber, setShowNumber] = useState({});
	const [packGiftData, setPackGiftData] = useState([]); //提交的包装或赠品
	const [loading, setLoading] = useState(false);

	const filterIds = useRef(undefined);

	const [form] = Form.useForm();

	const setTypeValue = Form.useWatch("setType", form);

	useEffect(() => {
		if (setTypeValue == 1) {
			form.setFieldsValue({
				addStrategy: 1
			});
		} else {
			form.setFieldsValue({
				addStrategy: ""
			});
		}
	}, [setTypeValue]);

	//修改包装赠品
	const setBatchPackageGift = async val => {
		const arr = [];
		packGiftData.forEach(item => {
			arr.push({
				goodsId: item.goodsId,
				goodsImage: item.goodsImage,
				goodsName: item.goodsName,
				goodsNum: item.goodsNum || 1,
				goodsPrice: item.goodsPrice,
				goodsSpec: item.goodsSpec,
				isCustom: 0,
				isVipGoods: 0,
				weight: item.goodsWeight,
				storeName: item.storeName,
				storeId: item.storeId,
				type: item.orderGoodsType == "package" ? 0 : 1,
				spu: item.goodsCommonid
			});
		});
		if (arr.length == 0 && [1, 2].includes(val.setType)) {
			return message.info("请勾选包装或赠品");
		}
		let params = {
			orderIds: filterIds.current || selectKeys,
			setType: val.setType,
			addStrategy: val.addStrategy,
			orderAccessoryList: arr
		};

		setLoading(true);
		const { success, data = {} } = await setBatchPackageGiftOp(params);
		const { msg = "" } = data;
		setLoading(false);
		if (success) {
			message.info(msg ? msg : "操作成功");
			handleOk();
		}
	};

	//提交
	const onOk = () => {
		if (loading) {
			return false;
		}
		form
			.validateFields()
			.then(val => {
				setBatchPackageGift(val);
			})
			.catch(err => {});
	};

	const orderAreaRadioProps = {
		searchForm,
		selectKeys,
		orderList,
		states: [10, 30],
		title: "（仅限待审核、异常订单）",
		updateShowNumer(obj, ids) {
			filterIds.current = ids;
			setShowNumber(obj);
		}
	};

	const columnsRender = useMemo(() => {
		const arr = [
			{
				name: "radio-group",
				slot: <OrderAreaRadioGroup {...orderAreaRadioProps} />
			},
			{
				block: (
					<>
						<OrderNumberCount
							data={[
								{ label: "待审核", value: showNumber[10], type: "warning" },
								{ label: "异常", value: showNumber[30], type: "error" }
							]}
						/>
						<SubTitle symbol as="s2" title="设置方式" wrapStyle={{ marginTop: 16 }} />
					</>
				)
			},
			{
				Component: Select,
				name: "setType",
				style: {
					marginTop: 16
				},
				props: {
					options: [
						{ value: 1, label: "添加包装或赠品" },
						{ value: 2, label: "删除所选包装或赠品" },
						{ value: 3, label: "删除订单所有包装" },
						{ value: 4, label: "删除订单所有赠品" }
					],
					placeholder: "添加包装或赠品"
				}
			}
		];
		if (setTypeValue == 1) {
			arr.push({
				name: "addStrategy",
				slot: (
					<Radio.Group>
						{setTypeValue == 1 ? (
							<Space direction="vertical">
								<Radio value={1}>订单已有包装或赠品的，重新覆盖</Radio>
								<Radio value={2}>订单已有包装或赠品的，直接跳过</Radio>
							</Space>
						) : (
							""
						)}
					</Radio.Group>
				)
			});
		}
		return arr;
	}, [setTypeValue]);

	return (
		<CommonModal title={{ title: "设置包装和赠品" }} open={true} width="870px" onOk={onOk} onCancel={handleCancel}>
			<CommonForm
				formProps={{
					form,
					initialValues: {
						setType: 1
						// addStrategy: 1
					}
				}}
				columns={columnsRender}
			></CommonForm>
			{setTypeValue == 1 || setTypeValue == 2 ? (
				<PackageAndGiveawayTabs
					onSelectionChange={selectData => {
						setPackGiftData(selectData);
					}}
				/>
			) : (
				""
			)}
			<CommonLoading loading={loading} />
		</CommonModal>
	);
}

export default SetPackageAndGiveawayModal;
